<script setup lang="ts">
import { useRouter } from 'vue-router';

const props=defineProps<{
  title?: string,
  rightText?: string,
  back:()=> void
}>()
const emit=defineEmits<{
  (e:'click-right'):void
}>()
const onClickRight=()=>{
  emit('click-right') //触发父组件里面的自定义事件
}
const router = useRouter()
const onClickLeft=()=>{
  if(props.back) return props.back()
  if(history.state?.back){
    router.back()
  }else{
    router.push('/')
  }
}
</script>
<template>
  <div>
    <van-nav-bar
    fixed
    @click-left="onClickLeft"
    left-arrow
    :title=title
    :right-text=rightText
    @click-right="onClickRight"> </van-nav-bar>
  </div>
</template>
<style lang="scss" scoped>
:deep() {
  .van-nav-bar {
    &__arrow {
      color: var(--cp-text1);
      font-size: 18px;
    }

    &__title {
      font-size: 15px;
    }
  }
}
</style>
